var filterPage = function () {
};
$(function () {
    const DATA_TYPE = {brand: 0, catalog: 1, price: 2, specs: 3};
    filterPage = function () {
        this.init();
    };

    filterPage.prototype = {
        // 初始化页面
        init: function () {
            this.bindEvent();
        },
        // 加载商品列表数据
        loaddata: function (postdata) {
            var model = this;
            $.ajax({
                headers: {'Content-Type': 'application/json'},
                type: 'POST',
                url: CONFIG_MANAGER.RequstUrl + "v1/goods/search/metadata",
                data: JSON.stringify(postdata)
            }).done(function (res) {
                if (res && res.filter) {
                    model.paintpage(res.filter);
                }
            });
        },

        //  画评论页面
        paintpage: function (filterdata) {
            var model = this;
            var html = [];
            html.push("<div id='filterpage' style='display: none'><div class='main bgbai' style='margin-top: 86px;padding-top: 0px'>");
            // 品牌
            if (filterdata.brand && filterdata.brand.length > 0) {
                html.push("<div class='shaixuan  mbbottom' id='filterdatabrand'><p class='shaixbt'>品牌</p><ul class='shaixnr shaixnr1 gdkuan'>");
                this.paintitem(filterdata.brand, html, DATA_TYPE.brand);
                html.push("</ul></div>");
            }

            // 价格
            if (filterdata.price && filterdata.price.length > 0) {
                html.push("<div class='shaixuan  mbbottom' id='filterdataprice'><p class='shaixbt'>价格</p><ul class='shaixnr shaixnr1 gdkuan'>");
                this.paintitem(filterdata.price, html, DATA_TYPE.price);

                html.push("</ul></div>");
            }

            // 分类
            if (filterdata.catalog) {
                html.push("<div class='shaixuan  mbbottom' id='filterdatacatalog'><p class='shaixbt'>分类</p><ul class='shaixnr shaixnr1 gdkuan'>");
                this.paintitem(filterdata.catalog, html, DATA_TYPE.catalog);
                html.push("</ul></div>");
            }

            // 规格
            if (filterdata.specs) {
                html.push("<div id='filterdataspecs'>");
                $.each(filterdata.specs, function (key, value) {
                    var datalength = value.length;
                    var ishidemore = (datalength > 8);

                    html.push("<div class='shaixuan  mbbottom'><p class='shaixbt'>" + key + "</p><ul class='shaixnr shaixnr1 gdkuan'>");
                    model.paintitem(value, html, DATA_TYPE.specs, key);
                    html.push("</ul></div>");
                });
                html.push("</div>");
            }
            html.push("</div>");
            html.push("<div class='footbg1 mbtop'><div class='sxanniu'><p class='sxqx' id='btncancle'><a>取消</a></p><p class='sxqd' id='btnconfirm'><a>确定</a></p></div></div></div>");

            $("#filterdiv").append(html.join(""));
        },
        paintitem: function (list, html, datatype, specstype) {
            var datalength = list.length;
            var ishidemore = (datalength > 8);
            for (var i = 0; i < datalength; i++) {
                var item = list[i];
                if (ishidemore && i == 7) {
                    html.push("<div style='display: none' name='moredata'>")
                }
                if (datatype == DATA_TYPE.brand || datatype == DATA_TYPE.catalog) {
                    html.push("<li tip='" + item.code + "'>" + item.name + "</li>");
                } else if (datatype == DATA_TYPE.price) {
                    html.push("<li tip='" + item + "'>" + item + "</li>");
                } else {
                    html.push("<li tip='" + specstype + "|" + item.replace(/[\r\n]/g, "") + "'>" + item.replace(/[\r\n]/g, "") + "</li>");
                }

                if (ishidemore && i == (datalength - 1)) {
                    html.push("</div>");
                    html.push("<li class='diandian' name='diandian'>&bull;&bull;&bull;</li>");
                }
            }

        },
        // 绑定事件
        bindEvent: function () {
            var model = this;
            // 显示更多
            $("#filterdiv").on("tap", "li", function () {
                var liitem = $(this);

                // 展开/收缩
                if (liitem.attr("name") == "diandian") {
                    if (liitem.hasClass("diandian-jiatou")) {
                        liitem.removeClass("diandian-jiatou").html("&bull;&bull;&bull;");
                        liitem.prev("div[name=moredata]").hide(100);
                    } else {
                        liitem.addClass("diandian-jiatou").html("<img src='../../images/top1.png'/>");
                        liitem.prev("div[name=moredata]").show(100);
                    }
                    return;
                }

                // 选中样式
                if (liitem.hasClass("hover")) {
                    liitem.removeClass("hover");
                } else {
                    liitem.parents("ul").find("li[class=hover]").removeClass("hover");
                    liitem.addClass("hover");
                }
            });

            // 确定操作
            $("#filterdiv").on("tap", "#btnconfirm", function () {
                var filterdata = {
                    brand: $("#filterdatabrand").find("li[class=hover]").attr("tip"),
                    price: $("#filterdataprice").find("li[class=hover]").attr("tip"),
                    catalog: $("#filterdatacatalog").find("li[class=hover]").attr("tip")
                };
                var specsli = $("#filterdataspecs").find("li[class=hover]");
                var specslist = [];
                $.each(specsli, function (i, item) {
                    specslist.push($(item).attr("tip"));
                });
                filterdata["specs"] = specslist.join(",");
                model.confirm(filterdata);
            });

            // 取消操作
            $("#filterdiv").on("tap", "#btncancle", function () {
                model.cancle();
            });
        },
        confirm: function (filterdata) {
        },
        cancle: function () {
        },
        show: function () {
            this.isdisplay = true;
            $("#filterpage").show();
        },
        hide: function () {
            this.isdisplay = false;
            $("#filterpage").hide();
        },
        isdisplay: false
    };

});
